<template>
  <div>
    <div id="magicalDragScene" class="mc-root mc-ui-absolute-pane">
      <div class="mc-ui-absolute-pane" style="width: 99.7%; height: 555px;">
        <el-tabs style="position: absolute; width: 100%; height: 553px; top: 0%; left: 0.159744%; text-align: left;"
                 :tab-position="tabPosition" value="first" @tab-click="_tabClick">
          <el-tab-pane name="first" style="height: 474px;" label="基本信息">
            <div class="mc-ui-absolute-pane" style="width: 100.733%; height: 484px;">
              <el-tag class="mc-ui-flex-center"
                      style="position: absolute; left: 0.161812%; top: 0.619835%; width: 4.12621%; height: 42px;">姓名
              </el-tag>
              <el-input style="position: absolute; left: 4.44984%; top: 0.619835%; width: 20.7929%;" v-model="input"
                        placeholder="请输入姓名"></el-input>
              <el-tag class="mc-ui-flex-center"
                      style="position: absolute; left: 0.161812%; top: 12.6033%; width: 4.12621%; height: 42px;">编号
              </el-tag>
              <el-input id="uuid47039157-d496-4077-bd0d-f5d5138422c4"
                        style="position: absolute; left: 4.28803%; top: 12.6033%; width: 20.7929%;" v-model="input"
                        placeholder="编号" readonly clearable></el-input>
              <el-input id="uuid437bd1a3-f0ce-48c1-81fd-80d32950a0b5"
                        style="position: absolute; left: 4.28803%; top: 12.6033%; width: 20.8738%;" v-model="input"
                        placeholder="编号" readonly clearable></el-input>
              <el-tag class="mc-ui-flex-center"
                      style="position: absolute; left: 0.161812%; top: 23.9669%; width: 4.12621%; height: 42px;">性别
              </el-tag>
              <el-tag class="mc-ui-flex-center"
                      style="position: absolute; left: 0.161812%; top: 35.7438%; width: 4.12621%; height: 42px;">民族
              </el-tag>
              <el-select id="uuid5207fd85-47d5-48e6-a163-f4f73c67bbd1"
                         style="position: absolute; left: 4.36893%; top: 36.157%; width: 20.7929%;" v-model="select"
                         @focus="focus">
                <el-option label="汉族" value="uuidfc456583-f89c-4859-9aa8-86b1d3343698"></el-option>
                <el-option label="蒙古族" value="uuid83f54ab6-c88b-43a7-82a2-75cb105d0949"></el-option>
              </el-select>
              <el-select style="position: absolute; left: 4.28803%; top: 24.3802%; width: 20.8738%;" v-model="select"
                         @focus="focus">
                <el-option label="男" value="男"></el-option>
                <el-option label="女" value="女"></el-option>
              </el-select>
              <el-tag class="mc-ui-flex-center"
                      style="position: absolute; left: 0.161812%; top: 47.1074%; width: 4.12621%; height: 42px;">证件类别
              </el-tag>
              <el-select id="uuidf1543236-d6c4-42c3-bf2c-ff554ae02efc"
                         style="position: absolute; left: 4.53074%; top: 47.5207%; width: 20.5502%;" v-model="select"
                         @focus="focus">
                <el-option label="居民身份证" value="uuid2dc9f5fd-26b3-40f0-9480-4149537b6c54"></el-option>
                <el-option label="军官证" value="uuid0efb48da-cba9-43af-9b91-cf8d5b12e506"></el-option>
                <el-option label="士兵证" value="uuid0efb48da-cba9-43af-9b91-cf8d5b12e506"></el-option>
                <el-option label="香港特别行政区护照、身份证" value="uuid0efb48da-cba9-43af-9b91-cf8d5b12e506"></el-option>
                <el-option label="澳门特别行政区护照、身份证" value="uuid0efb48da-cba9-43af-9b91-cf8d5b12e506"></el-option>
              </el-select>
              <el-tag class="mc-ui-flex-center"
                      style="position: absolute; left: 0.161812%; top: 58.4711%; width: 4.12621%; height: 42px;">证件号码
              </el-tag>
              <el-input id="uuid9fcb5f47-535a-45a3-a3f6-fb2b5f2f814e"
                        style="position: absolute; left: 4.53074%; top: 58.8843%; width: 20.6311%;" v-model="input"
                        placeholder="请输入证件号码"></el-input>
              <el-tag class="mc-ui-flex-center"
                      style="position: absolute; left: 0.161812%; top: 69.4215%; width: 4.12621%; height: 42px;">出生日期
              </el-tag>
              <el-date-picker style="position: absolute; left: 4.53074%; top: 69.4215%; width: 20.6311%;"
                              v-model="datePicker" :editable="true" :clearable="true" type="datetime"
                              format="yyyy-MM-dd HH:mm:ss" placeholder="请选择出生日期"></el-date-picker>
              <el-tag class="mc-ui-flex-center"
                      style="position: absolute; left: 29.0453%; top: 69.4215%; width: 6.95793%; height: 42px;">参加工作日期
              </el-tag>
              <el-date-picker style="position: absolute; left: 36.0032%; top: 69.8347%; width: 20.712%;"
                              v-model="datePicker" :editable="true" :clearable="true" type="datetime"
                              format="yyyy-MM-dd HH:mm:ss" placeholder="请选择参加工作日期"></el-date-picker>
              <el-tag class="mc-ui-flex-center"
                      style="position: absolute; left: 29.0453%; top: 58.4711%; width: 6.95793%; height: 42px;">参加工作日期
              </el-tag>
              <el-tag class="mc-ui-flex-center"
                      style="position: absolute; left: 28.9644%; top: 47.5207%; width: 6.95793%; height: 42px;">参加工作日期
              </el-tag>
              <el-tag class="mc-ui-flex-center"
                      style="position: absolute; left: 28.9644%; top: 36.157%; width: 6.95793%; height: 42px;">参加工作日期
              </el-tag>
              <el-tag class="mc-ui-flex-center"
                      style="position: absolute; left: 28.8026%; top: 24.3802%; width: 6.95793%; height: 42px;">参加工作日期
              </el-tag>
              <el-tag class="mc-ui-flex-center"
                      style="position: absolute; left: 28.8026%; top: 12.1901%; width: 6.95793%; height: 42px;">参加工作日期
              </el-tag>
              <div class="mc-ui-absolute-pane" style="width: 100.733%; height: 484px;">
                <el-tag class="mc-ui-flex-center"
                        style="position: absolute; left: 0.161812%; top: 0.619835%; width: 4.12621%; height: 42px; color: rgb(57, 61, 73);">
                  姓名
                </el-tag>
                <el-input style="position: absolute; left: 4.44984%; top: 0.619835%; width: 20.7929%;" v-model="input"
                          placeholder="请输入姓名"></el-input>
                <el-tag class="mc-ui-flex-center"
                        style="position: absolute; left: 0.161812%; top: 12.6033%; width: 4.12621%; height: 42px; color: rgb(57, 61, 73);">
                  编号
                </el-tag>
                <el-input id="uuidaf0e93c2-e59d-4fad-8de3-f4a7777aea02"
                          style="position: absolute; left: 4.28803%; top: 12.6033%; width: 20.8738%;" v-model="input"
                          placeholder="编号" readonly clearable></el-input>
                <el-tag class="mc-ui-flex-center"
                        style="position: absolute; left: 0.161812%; top: 23.9669%; width: 4.12621%; height: 42px; color: rgb(57, 61, 73);">
                  性别
                </el-tag>
                <el-select style="position: absolute; left: 4.28803%; top: 24.3802%; width: 20.8738%;" v-model="select"
                           @focus="focus">
                  <el-option label="男" value="uuid330ca516-7d0a-4323-bf22-13b75ec9dc2c"></el-option>
                  <el-option label="女" value="uuidb0d7fb60-b733-4da6-a07f-472dd832d3fb"></el-option>
                </el-select>
                <el-tag class="mc-ui-flex-center"
                        style="position: absolute; left: 0.161812%; top: 35.7438%; width: 4.12621%; height: 42px; color: rgb(57, 61, 73);">
                  民族
                </el-tag>
                <el-select id="uuidd69e68a9-a696-4828-a542-0c5aec356818"
                           style="position: absolute; left: 4.36893%; top: 36.157%; width: 20.7929%;" v-model="select"
                           @focus="focus">
                  <el-option label="汉族" value="uuid9a213af4-ec18-469e-84fc-1491e3cd589a"></el-option>
                  <el-option label="蒙古族" value="uuide2eb9344-c3ac-4783-8320-cdb8f553956b"></el-option>
                </el-select>
                <el-tag class="mc-ui-flex-center"
                        style="position: absolute; left: 0.161812%; top: 47.1074%; width: 4.12621%; height: 42px; color: rgb(57, 61, 73);">
                  证件类别
                </el-tag>
                <el-select id="uuidff28b408-f3d1-4fbc-8120-e78ae1ca8485"
                           style="position: absolute; left: 4.53074%; top: 47.5207%; width: 20.5502%;" v-model="select"
                           @focus="focus">
                  <el-option label="居民身份证" value="uuidabbdc898-c236-43ce-b86a-563bd836bbad"></el-option>
                  <el-option label="军官证" value="uuidaa6e02ac-c16a-4fc4-9261-a379c1906782"></el-option>
                  <el-option label="士兵证" value="uuidfefebb59-b037-4133-b295-697d66603057"></el-option>
                  <el-option label="香港特别行政区护照、身份证" value="uuidd8d8d369-95b0-432a-a48b-f0d29859cae1"></el-option>
                  <el-option label="澳门特别行政区护照、身份证" value="uuiddb6f48a3-e9d8-4d7e-89a1-320b271f62c4"></el-option>
                </el-select>
                <el-tag class="mc-ui-flex-center"
                        style="position: absolute; left: 0.161812%; top: 58.4711%; width: 4.12621%; height: 42px; color: rgb(57, 61, 73);">
                  证件号码
                </el-tag>
                <el-input id="uuid4c4601bf-9d0e-4df4-99e0-d11eea4cc2c0"
                          style="position: absolute; left: 4.53074%; top: 58.8843%; width: 20.6311%;" v-model="input"
                          placeholder="请输入证件号码"></el-input>
                <el-tag class="mc-ui-flex-center"
                        style="position: absolute; left: 0.161812%; top: 69.4215%; width: 4.12621%; height: 42px; color: rgb(57, 61, 73);">
                  出生日期
                </el-tag>
                <el-date-picker style="position: absolute; left: 4.53074%; top: 69.4215%; width: 20.6311%;"
                                v-model="datePicker" :editable="true" :clearable="true" type="datetime"
                                format="yyyy-MM-dd HH:mm:ss" placeholder="请选择出生日期"></el-date-picker>
                <el-tag class="mc-ui-flex-center"
                        style="position: absolute; left: 29.0453%; top: 69.4215%; width: 6.95793%; height: 42px; color: rgb(57, 61, 73);">
                  参加工作日期
                </el-tag>
                <el-date-picker style="position: absolute; left: 36.0032%; top: 69.8347%; width: 20.712%;"
                                v-model="datePicker" :editable="true" :clearable="true" type="datetime"
                                format="yyyy-MM-dd HH:mm:ss" placeholder="请选择参加工作日期"></el-date-picker>
                <el-tag class="mc-ui-flex-center"
                        style="position: absolute; left: 29.0453%; top: 58.4711%; width: 6.95793%; height: 42px; color: rgb(57, 61, 73);">
                  健康状况
                </el-tag>
                <el-tag class="mc-ui-flex-center"
                        style="position: absolute; left: 28.9644%; top: 47.5207%; width: 6.95793%; height: 42px; color: rgb(57, 61, 73);">
                  婚姻状况
                </el-tag>
                <el-tag class="mc-ui-flex-center"
                        style="position: absolute; left: 28.9644%; top: 36.157%; width: 6.95793%; height: 42px; color: rgb(57, 61, 73);">
                  入党团时间
                </el-tag>
                <el-tag class="mc-ui-flex-center"
                        style="position: absolute; left: 28.8026%; top: 24.3802%; width: 6.95793%; height: 42px; color: rgb(57, 61, 73);">
                  出生地
                </el-tag>
                <el-tag class="mc-ui-flex-center"
                        style="position: absolute; left: 28.8026%; top: 12.1901%; width: 6.95793%; height: 42px; color: rgb(57, 61, 73);">
                  籍贯
                </el-tag>
                <el-tag class="mc-ui-flex-center"
                        style="position: absolute; left: 28.8136%; top: 0.619835%; width: 6.95793%; height: 42px; color: rgb(57, 61, 73);">
                  政治面貌
                </el-tag>
                <el-select style="position: absolute; left: 35.9161%; top: 0.619835%; width: 20.7425%;" v-model="select"
                           @focus="focus">
                  <el-option label="中共党员" value="1"></el-option>
                  <el-option label="预备党员" value="2"></el-option>
                  <el-option label="共青团员" value="3"></el-option>
                  <el-option label="群众" value="4"></el-option>
                </el-select>
                <el-select id="uuidc870d57a-7ed7-4ab1-a252-f370fbe65e68"
                           style="position: absolute; left: 36.0775%; top: 12.6033%; width: 20.7425%;" v-model="select"
                           @focus="focus">
                  <el-option label="江西" value="uuidfbb9056c-037a-485d-8da8-067c489eb775"></el-option>
                  <el-option label="上海" value="uuid0a6cfbf3-dfda-450a-8ede-66cafae06350"></el-option>
                  <el-option label="北京" value="uuidf99f2352-9e18-4bfe-bb57-2ac756002c73"></el-option>
                  <el-option label="河南" value="uuid1c61f04a-6bbc-4fc8-80ab-188ba85bcb22"></el-option>
                </el-select>
                <el-select id="uuid67c9aa8e-c82c-469c-917d-1cd5ad661d8e"
                           style="position: absolute; left: 36.0775%; top: 24.7934%; width: 20.7425%;" v-model="select"
                           @focus="focus">
                  <el-option label="江西" value="uuide0515930-7b0e-44ad-b16e-025ebd3069cf"></el-option>
                  <el-option label="上海" value="uuid1b5759ca-d13d-4c0d-8256-0542560c8f9c"></el-option>
                  <el-option label="北京" value="uuid968d0e87-6184-42ce-a45f-109082d247e1"></el-option>
                  <el-option label="河南" value="uuid90044cc7-29fd-4a79-a24c-bd7dc049bf62"></el-option>
                </el-select>
                <el-date-picker style="position: absolute; left: 36.0775%; top: 36.157%; width: 20.7425%;"
                                v-model="datePicker" :editable="true" :clearable="true" type="datetime"
                                format="yyyy-MM-dd HH:mm:ss" placeholder="请选择入党团时间"></el-date-picker>
                <el-select style="position: absolute; left: 35.9161%; top: 47.9339%; width: 20.904%;" v-model="select"
                           @focus="focus">
                  <el-option label="未婚" value="1"></el-option>
                  <el-option label="已婚" value="2"></el-option>
                  <el-option label="离魂" value="3"></el-option>
                  <el-option label="丧偶" value="4"></el-option>
                </el-select>
                <el-select id="uuid939b3750-e36a-491a-9a42-1343866d5d38"
                           style="position: absolute; left: 35.9161%; top: 58.8843%; width: 20.904%;" v-model="select"
                           @focus="focus">
                  <el-option label="健康" value="uuidef3e99d8-1bd1-45d8-8d4e-7bf84ee8d08f"></el-option>
                  <el-option label="身体一般" value="uuid85171f6a-5932-46f1-910a-bb0448159282"></el-option>
                </el-select>
                <el-button
                  style="position: absolute; left: 0.161421%; top: 86.3636%; background-color: rgb(95, 184, 120);">提交
                </el-button>
                <el-button id="uuidece485d6-dd2f-4663-861a-4cfe4a51c55a"
                           style="position: absolute; left: 19.2897%; top: 86.3636%; background-color: rgb(30, 144, 255);">
                  保存
                </el-button>
                <el-button id="uuid72b97f8a-e957-4ee6-826c-cd92f0d02121"
                           style="position: absolute; left: 39.0638%; top: 86.3636%; background-color: rgb(255, 184, 0);">
                  修改
                </el-button>
                <el-button id="uuid03f222b9-8e44-4ed9-a0db-052f5a3e6c24"
                           style="position: absolute; left: 59.1606%; top: 86.3636%; background-color: rgb(30, 144, 255);">
                  重置
                </el-button>
                <el-button id="uuid07ea0a53-a500-49b3-8eda-1fd515ef27c5"
                           style="position: absolute; left: 78.9346%; top: 86.3636%; background-color: rgb(95, 184, 120);">
                  导出
                </el-button>
                <div class="mc-ui-geometry-rectangle mc-ui-flex-center"
                     style="width: 280px; height: 189px; position: absolute; left: 69.2494%; top: 12.6033%;"></div>
                <el-upload style="position: absolute; left: 69.2494%; top: 53.9256%; width: 6.53753%;"
                           action="https://jsonplaceholder.typicode.com/posts/" :file-list="fileList"
                           :show-file-list="true" :auto-upload="true">
                  <el-button style="background-color: rgb(30, 144, 255); width: 352.5%; height: 33px;" size="small"
                             type="primary">上传照片
                  </el-button>
                </el-upload>
                <el-image style="width: 22.7603%; height: 192px; position: absolute; left: 69.2494%; top: 12.3967%;"
                          src="img.jpg"></el-image>
              </div>
            </div>
          </el-tab-pane>
          <el-tab-pane name="second" style="height: 474px;" label="教育背景"></el-tab-pane>
          <el-tab-pane name="three" style="height: 475px;" label="工作经历"></el-tab-pane>
          <el-tab-pane name="four" style="height: 473px;" label="职称信息"></el-tab-pane>
          <el-tab-pane name="five" style="height: 472px;" label="年度考核"></el-tab-pane>
          <el-tab-pane name="six" style="height: 472px;" label="培训情况"></el-tab-pane>
          <el-tab-pane name="seven" style="height: 472px;" label="档案信息"></el-tab-pane>
          <el-tab-pane name="eight" style="height: 472px;" label="附件材料"></el-tab-pane>
        </el-tabs>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  name: "index",
  data() {
    return {
      tabPosition: 'left'
    };
  }
}
</script>

<style scoped>

</style>
